<template>
    <view class="page">
        <view class="content">
            <u-form labelPosition="left"
                    labelWidth="100"
                    :model="form"
                    ref="uForm">
                <u-form-item label="账单id" borderBottom>
                    <u-input v-model="form.b_ids" border="none" placeholder="请输入账单id,有多个用逗号分割"></u-input>
                </u-form-item>

                <u-form-item label="用户id" borderBottom v-if="!form.u_id">
                    <u-input v-model="form.u_id" border="none" placeholder="请输入用户id"></u-input>
                </u-form-item>

                <u-form-item label="支付金额" borderBottom>
                    <u-input v-model="form.price" border="none" placeholder="请输入支付金额"></u-input>
                </u-form-item>
                <u-form-item label="房屋id" borderBottom>
                    <u-input v-model="form.h_id" border="none" placeholder="请输入房屋id"></u-input>
                </u-form-item>
                <u-form-item label="sh_id" borderBottom>
                    <u-input v-model="form.sh_id" border="none" placeholder="房屋是合租类型的 必传"></u-input>
                </u-form-item>
            </u-form>

            <u-gap height="150"></u-gap>

            <u-row>
                <u-button type="primary" text="去支付" @click="submitHandler"></u-button>
            </u-row>
        </view>
    </view>
</template>

<script>
    export default {
        name: "sandbox",
        data(){
            return{
                form:{
                    b_ids: '',
                    u_id: uni.getStorageSync('u_id'),
                    price: '',
                    h_id: '',
                    sh_id: ''
                },
            }
        },
        methods:{
            submitHandler(){
                let data = uni.$u.deepClone(this.form);

                uni.showLoading({title: '正在等待'});
                uni.$u.http.post('/api.php/Pay/pay_do', data).then(res => {
                    uni.hideLoading();

                    if (res === '') {
                        console.log(res);
                        return;
                    }else{
                        let payment ={
                            provider: 'wxpay',
                            orderInfo:'测试信息',
                            appId: res.appId,
                            timeStamp: res.timeStamp,
                            nonceStr: res.nonceStr,
                            package: res.package,
                            signType: res.signType,
                            paySign: res.paySign,
                            success:function () {
                                uni.showToast({
                                    title: '支付成功', //提示文字
                                    duration: 2000, //显示时长
                                    icon: "success", //图标，支持"success"、"loading"
                                });
                            },
                            fail:function () {
                                uni.showToast({
                                    title: '支付失败',
                                    duration: 2000,
                                    icon: "error",
                                });
                            }
                        };
                        uni.requestPayment(payment);
                    }
                });

            }
        }
    }
</script>

<style scoped>
    .page {
        width: 100%;
        min-height: 100vh;
        background-color: #ffffff;
    }

    .content {
        padding: 20rpx;
    }
</style>